// packageK/tile-map/tile-map.js
const app = getApp()
const marks = [
  {id: 1, text: '仙塘老街', top: 4300, left: 1550, },
  {id: 2, text: '大夫第', top: 2734, left: 1671, article_id: 7},
  {id: 3, text: '柳溪书院', top: 2862, left: 2153, article_id: 9},
  {id: 4, text: '新衙门', top: 2123, left: 2495, article_id: 6},
  {id: 5, text: '老衙门', top: 1805, left: 3070, article_id: 5},
  {id: 6, text: '古炮楼(碉楼)', top: 2134, left: 2974, article_id: 4},
  {id: 7, text: '仙塘学堂', top: 2394, left: 3128, article_id: 10},
  {id: 8, text: '遗址公园', top: 2078, left: 3472, article_id: 8},
  {id: 9, text: '奉天大夫', top: 2627, left: 3462},
  {id: 10, text: '蟠龙古树', top: 2317, left: 3709, article_id: 11},
  {id: 11, text: '潘公墙', top: 1934, left: 3984},
  {id: 12, text: '老楼', top: 2126, left: 4199, article_id: 2},
  {id: 13, text: '新楼', top: 1775, left: 4681, article_id: 3},
  {id: 14, text: '南园文化广场', top: 2334, left: 4710, article_id: 1},
  {id: 15, text: '游客中心', top: 2646, left: 4692},
  {id: 16, text: '仙塘老街', top: 3387, left: 4623},
  {id: 17, text: '游客中心(功能配套区)', top: 2358, left: 5417},
  {id: 18, text: '仙塘老街', top: 2984, left: 5770},
  {id: 19, text: '南园古村博物馆', top: 976, left: 6841, article_id: 12},
  {id: 20, text: '仙塘老街', top: 1523, left: 7147}
]

const identifying = [
  {id: 1, text: '出入口'},
  {id: 2, text: '售票处'},
  {id: 3, text: '停车场'},
  {id: 4, text: '游客中心'},
  {id: 5, text: '咨询处'},
  {id: 6, text: '医务室'},
  {id: 7, text: '公用电话'},
  {id: 8, text: '休息区'},
  {id: 9, text: '无障碍通道'},
  {id: 10, text: '卫生间'},
  {id: 11, text: '无障碍卫生间'},
  {id: 12, text: '家庭卫间'},
  {id: 13, text: '母婴室'},
  {id: 14, text: '咖啡厅'},
  {id: 15, text: '行李寄存处'},
  {id: 16, text: '失物招领'},
  {id: 17, text: '导游服务'},
  {id: 18, text: '餐厅'},
  {id: 19, text: '宾馆'},
  {id: 20, text: '购物场所'},
  {id: 21, text: '充电桩'},
  {id: 22, text: '公共汽车'},
  {id: 23, text: '电瓶车'},
  // {id: 24, text: '您所在位置'}
]
Page({

  /**
   * 页面的初始数据
   */
  data: {
    SERVER_UR: "https://xiyuangucun.stjkj.cn/static/images/",
    identifyingVisible: false,
    identifying,
    tileMapList: [],
    marks,
    ROW: 10,
    COL: 10,
    imgWidth: 750,
    imgHeight: 500,
    scaleValue: 0.2
  },

  /**
   * mark点击跳转到详情页面
   * @param {Object} e 
   */
  markClick: function(e) {
    const { item } = e.currentTarget.dataset
    if (!item.article_id) {
      app.tips(`【${item.text}】详细介绍完善中...`)
      return
    }
    const path = '/packageA/member/article/articleContent/articleContent?article_id='
    wx.navigateTo({
      url: path + item.article_id,
    })
  },

  /**
   * 显示标识
   */
  showIdentifying: function() {
    this.setData({
      identifyingVisible: true
    })
  },

  /**
   * 隐藏标识
   */
  hideIdentifying: function() {
    this.setData({
      identifyingVisible: false
    })
  },

  /**
   * 初始化瓦片地图图片地址
   */
  initTileData: function() {
    let arr = []
    const { SERVER_UR } = this.data
    for (let i = 0; i < 10; i++) {
      for (let j = 0; j < 10; j++) {
        arr.push({
          id: `${i}-${j}`,
          src: `${SERVER_UR}map/${i}-${j}.jpg`
        })
      }
    }
    this.setData({
      tileMapList: arr
    })
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad(options) {
    this.initTileData()
  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload() {
    this.setData({
      tileMapList: []
    })
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady() {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow() {
    wx.hideHomeButton()
  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide() {
    this.setData({
      tileMapList: []
    })
  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload() {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh() {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom() {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage() {

  }
})